<template>
  <div style="padding: 20px">
    <div class="tip">
      <p>温馨提示</p>
      <p>您需要在微信平台配置 - 模板消息通知 - 通知管理员 中配置您的模板ID;</p>
      <p>管理员接收信息提醒需先在管理员列表扫码绑定公众号；</p>
      <p>所有开关默认关闭，您可以最多设置 10 个管理员账号接收通知。</p>
    </div>
    <el-table :data="list" style="width: 100%">
      <el-table-column prop="title" label="提醒服务" width="width">
      </el-table-column>
      <el-table-column prop="is_open" label="开启/关闭" width="width">
        <template slot-scope="scope">
          <el-switch
            v-model="scope.row.is_open"
            active-color="#13ce66"
            inactive-color="#ff4949"
          ></el-switch>
        </template>
      </el-table-column>
      <el-table-column prop="admin_name" label="提醒人列表" width="width">
        <template slot-scope="scope">
          <el-tag
            v-for="item in scope.row.admin_name"
            :key="item"
            size="mini"
            >{{ item }}</el-tag
          >
        </template>
      </el-table-column>
    </el-table>
  </div>
</template>

<script>
export default {
  data() {
    return {
      list: [
        {
          id: 1,
          title: "企业注册通知",
          is_open: true,
          tag: [2, 3],
          admin_name: ["blrc", "blrcfwzx"],
        },
        {
          id: 2,
          title: "个人注册通知",
          is_open: false,
          tag: [],
          admin_name: [],
        },
        {
          id: 3,
          title: "简历审核通知",
          is_open: false,
          tag: [],
          admin_name: [],
        },
        {
          id: 4,
          title: "企业认证审核",
          is_open: false,
          tag: [],
          admin_name: [],
        },
        {
          id: 5,
          title: "职位审核通知",
          is_open: false,
          tag: [],
          admin_name: [],
        },
        {
          id: 6,
          title: "企业订单通知",
          is_open: false,
          tag: [],
          admin_name: [],
        },
        {
          id: 7,
          title: "个人订单通知",
          is_open: false,
          tag: [],
          admin_name: [],
        },
        {
          id: 8,
          title: "订单支付成功通知",
          is_open: false,
          tag: [],
          admin_name: [],
        },
        {
          id: 9,
          title: "照片作品审核通知",
          is_open: false,
          tag: [],
          admin_name: [],
        },
        {
          id: 10,
          title: "企业风采审核通知",
          is_open: false,
          tag: [],
          admin_name: [],
        },
        {
          id: 11,
          title: "账号注销申请通知",
          is_open: false,
          tag: [],
          admin_name: [],
        },
        {
          id: 12,
          title: "投诉举报通知",
          is_open: false,
          tag: [],
          admin_name: [],
        },
        {
          id: 13,
          title: "账号申诉通知",
          is_open: false,
          tag: [],
          admin_name: [],
        },
        {
          id: 14,
          title: "意见建议通知",
          is_open: false,
          tag: [],
          admin_name: [],
        },
        {
          id: 15,
          title: "网络招聘会审核通知",
          is_open: false,
          tag: [],
          admin_name: [],
        },
        {
          id: 16,
          title: "视频招聘审核通知",
          is_open: false,
          tag: [],
          admin_name: [],
        },
        {
          id: 17,
          title: "视频求职审核通知",
          is_open: false,
          tag: [],
          admin_name: [],
        },
      ],
    };
  },
};
</script>

<style lang="scss" scoped>
.tip {
  padding: 8px 16px;
  background-color: #fdf6ec;
  border-radius: 4px;
  border-left: 5px solid #f9c77c;
  margin: 0 0 20px;
  p {
    font-size: 14px;
    color: #e6a23c;
    line-height: 1em;
  }
}
</style>
